<template>
  
  <el-button type="danger" @click="Addinfo()">新增</el-button>
  <el-table :data="array" style="width: 100%">
    <el-table-column v-slot="scope" label="耳标">
      <el-select v-model="scope.row.earTag" placeholder="请选择" @change="GetEartag(scope.row.earTag, scope.$index)"
        size="large" style="width: 240px">
        <el-option v-for="item in GetShows" :key="item.earTagNumber" :label="item.earTagNumber"
          :value="item.earTagNumber" />
      </el-select>
    </el-table-column>
    <el-table-column v-slot="scope" label="死亡原因">
      <el-select v-model="scope.row.deathType" placeholder="请选择" size="large" style="width: 240px">
        <el-option v-for="item in GetCauShow" :key="item.value" :label="item.name" :value="item.value" />
      </el-select>

    </el-table-column>
    <el-table-column prop="name" label="品种" v-slot="scope">
      <span v-if="scope.row.variety == 1">杜泊</span>
      <span v-if="scope.row.variety == 2">澳洲白</span>
      <span v-if="scope.row.variety == 3">萨福克</span>
      <span v-if="scope.row.variety == 4">杜湖</span>
      <span v-if="scope.row.variety == 5">杜杜湖</span>
      <span v-if="scope.row.variety == 6">萨杜湖</span>
      <span v-if="scope.row.variety == 7">奥湖</span>
      <span v-if="scope.row.variety == 8">湖羊</span>
      <span v-if="scope.row.variety == 9">奥杜湖</span>


    </el-table-column>

    <el-table-column prop="name" label="性别" v-slot="scope">
      <span v-if="scope.row.sheepRescissionSex == true">男</span>
      <span v-if="scope.row.sheepRescissionSex == false">女</span>

    </el-table-column>
    <el-table-column prop="name" label="当前栋舍" v-slot="scope">

      <span v-if="scope.row.buildingManagementId == 1">配种舍</span>
      <span v-if="scope.row.buildingManagementId == 2">后备舍</span>
      <span v-if="scope.row.buildingManagementId == 5">公羊舍</span>
      <span v-if="scope.row.buildingManagementId == 6">妊检舍</span>
      <span v-if="scope.row.buildingManagementId == 7">分娩舍</span>
      <span v-if="scope.row.buildingManagementId == 8">断奶舍</span>
      <span v-if="scope.row.buildingManagementId == 9">育肥舍</span>
      <span v-if="scope.row.buildingManagementId == 10">母羊舍</span>
      <span v-if="scope.row.buildingManagementId == 11">采购舍</span>
      <span v-if="scope.row.buildingManagementId == 12">后裔舍</span>
    </el-table-column>
    <el-table-column prop="name" label="当前栏位" v-slot="scope">

      <span v-if="scope.row.columnManagementId == 1">配种栏位1</span>
      <span v-if="scope.row.columnManagementId == 2">配种栏位2</span>
      <span v-if="scope.row.columnManagementId == 3">后备栏位1</span>
      <span v-if="scope.row.columnManagementId == 4">后备栏位2</span>
      <span v-if="scope.row.columnManagementId == 5">公羊栏位1</span>
      <span v-if="scope.row.columnManagementId == 6">公羊栏位2</span>
      <span v-if="scope.row.columnManagementId == 7">妊检栏位1</span>
      <span v-if="scope.row.columnManagementId == 8">妊检栏位2</span>
      <span v-if="scope.row.columnManagementId == 9">分娩栏位1</span>
      <span v-if="scope.row.columnManagementId == 10">妊检栏位2</span>
      <span v-if="scope.row.columnManagementId == 11">断奶栏位1</span>
      <span v-if="scope.row.columnManagementId == 12">断奶栏位2</span>
      <span v-if="scope.row.columnManagementId == 13">育肥栏位1</span>
      <span v-if="scope.row.columnManagementId == 14">育肥栏位2</span>
      <span v-if="scope.row.columnManagementId == 15">母羊栏位1</span>
      <span v-if="scope.row.columnManagementId == 16">母羊栏位2</span>
      <span v-if="scope.row.columnManagementId == 17">采购栏位1</span>


    </el-table-column>

  </el-table>
  <div>
    <el-button type="danger" @click="AddLong()">+增行</el-button>
    <el-button type="danger" @click="DeleteForm()">-增行</el-button>
  </div>
</template>

<script lang="ts" setup>
import { reactive, ref } from 'vue'
import type { ComponentSize, FormInstance, FormRules } from 'element-plus'

import starts from "@/api/SheepManagement/SheepIndex";
import DetathModel from "@/api/SheepManagement/SheepIndex";

import { EartagAdd } from "@/api/EarTagManagement/model";
import axios from "axios";
import { number } from "echarts";
import { json } from 'stream/consumers';
import { useRoute } from 'vue-router';
const Route = useRoute()


const Addinfo = () => {
  starts.Addinfo(array.value).then(res => {
    console.log(array.value)
    if (res.data > 0) {
      ElMessage.success("添加成功");
    }
    else {
      ElMessage.success("添加失败");
    }
  })
}

let array: any = ref([
  {
    deathDate: "2024-08-01",
    earTag: "",
    deathType: null,
    variety: null,
    sheepRescissionSex: null,
    buildingManagementId: null,
    columnManagementId: null
  }
]);

const Find = () => {
  starts.Finds(Route.query.deathId).then(res => {
    console.log("有数据", res.data);
  })
};


//增行
const c = ref(0);
const AddLong = () => {
  c.value = 1;
  array.value.forEach((item: any) => {
    c.value++;
  })
  if (c.value > 15) {
    ElMessage.error("最多只能添加15行");
    return;

  }

  array.value.push({
    deathDate: "2024-08-01",
    earTag: "",
    deathType: null,
    variety: null,
    sheepRescissionSex: null,
    reproductiveState: null,
    buildingManagementId: null,
    columnManagementId: null
  });
  localStorage.setItem("data", JSON.stringify(array.value));
}


const DeleteForm = () => {
  array.value.pop();
  localStorage.setItem("data", JSON.stringify(array.value));
}

const detaths = reactive([{
  deathDate: "2024-08-01",
  earTag: "",
  deathType: null,
  variety: null,
  sheepRescissionSex: null,
  reproductiveState: null,
  buildingManagementId: null,
  columnManagementId: null
}]);



const GetShows = ref([])
const GetShowEatg = () => {
  starts.GetEate().then(res => {
    detaths.forEach(x => {
      console.log("有没有数据", x.earTag);
      x.earTag = res.data.earTag
    })

  })
}
const GetCauShow = ref([])
const GetCaus = () => {
  starts.GetCause().then(res => {
    GetCauShow.value = res.data
  })
}


const GetEartag = (earTag: any, index: any) => {
  starts.FindEarTag(earTag).then((res: any) => {
    (array.value[index].variety = res.data[index].variety);
    (array.value[index].sheepRescissionSex = res.data[index].sheepSex);
    (array.value[index].buildingManagementId = res.data[index].buildingId);
    (array.value[index].columnManagementId = res.data[index].columnId);
  })
}




onMounted(() => {
  GetShowEatg()
  GetCaus()
  Find()

})


</script>